<!--&lt;!&ndash;vue 使用tinymce富文本编辑器&ndash;&gt;-->
<!--&lt;!&ndash;1、组件方式：&ndash;&gt;-->
<!--&lt;!&ndash;https://www.cnblogs.com/dayin1/p/13582087.html&ndash;&gt;-->
<!--&lt;!&ndash;https://www.cnblogs.com/zhongchao666/p/11142537.html&ndash;&gt;-->
<!--&lt;!&ndash;https://blog.csdn.net/Silence_Sep/article/details/106113434&ndash;&gt;-->
<!--&lt;!&ndash;插入地图：https://blog.csdn.net/chengxiangbai/article/details/103709942&ndash;&gt;-->
<!--<template>-->
<!--  <div class="tinymce-editor">-->
<!--    <editor v-model="myValue"-->
<!--            :init="init"-->
<!--            :disabled="disabled"-->
<!--            @onClick="onClick">-->
<!--    </editor>-->
<!--  </div>-->
<!--</template>-->

<!--<script>-->
<!--  import tinymce from 'tinymce/tinymce'-->
<!--  import Editor from '@tinymce/tinymce-vue'-->
<!--  import 'tinymce/themes/silver'-->
<!--  import 'tinymce/themes/silver/theme'-->
<!--  import 'tinymce/icons/default/icons'-->

<!--  import 'tinymce/plugins/image'-->
<!--  import 'tinymce/plugins/media'-->
<!--  import 'tinymce/plugins/table'-->
<!--  import 'tinymce/plugins/lists'-->
<!--  import 'tinymce/plugins/contextmenu'-->
<!--  import 'tinymce/plugins/wordcount'-->
<!--  import 'tinymce/plugins/colorpicker'-->
<!--  import 'tinymce/plugins/textcolor'-->
<!--  import '@/utils/plugins/bdmap'-->
<!--  export default {-->
<!--    components: {-->
<!--      Editor-->
<!--    },-->
<!--    props: {-->
<!--      //传入一个value，使组件支持v-model绑定-->
<!--      value: {-->
<!--        type: String,-->
<!--        default: ''-->
<!--      },-->
<!--      disabled: {-->
<!--        type: Boolean,-->
<!--        default: false-->
<!--      },-->
<!--      plugins: {-->
<!--        type: [String, Array],-->
<!--        default: 'lists image media table textcolor wordcount contextmenu'-->
<!--      },-->
<!--      toolbar: {-->
<!--        type: [String, Array],-->
<!--        default: 'undo redo |  formatselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | lists image media table | removeformat'-->
<!--      }-->
<!--    },-->
<!--    data() {-->
<!--      return {-->
<!--        //初始化配置-->
<!--        init: {-->
<!--          language_url: '/static/plugins/tinymce/langs/zh_CN.js',-->
<!--          language: 'zh_CN',-->
<!--          skin_url: '/static/plugins/tinymce/skins/ui/oxide',-->
<!--          content_css: '/static/plugins/tinymce/skins/content/default/content.css',-->
<!--          // skin_url: `/static/plugins/tinymce/skins/ui/oxide-dark`, // 暗色系-->
<!--          // content_css: `/static/plugins/tinymce/skins/content/dark/content.css`, // 暗色系-->
<!--          height: 300,-->
<!--          plugins: this.plugins,-->
<!--          toolbar: this.toolbar,-->
<!--          branding: false,-->
<!--          menubar: false,-->
<!--          //此处为图片上传处理函数，这个直接用了base64的图片形式上传图片，-->
<!--          //如需ajax上传可参考https://www.tiny.cloud/docs/configure/file-image-upload/#images_upload_handler-->
<!--          images_upload_handler: (blobInfo, success, failure) => {-->
<!--            const img = 'data:image/jpeg;base64,' + blobInfo.base64()-->
<!--            success(img)-->
<!--            // var formData-->
<!--            // var file = blobInfo.blob() // 转化为易于理解的file对象-->
<!--            // formData = new FormData()-->
<!--            // formData.append('file', file, file.name) // 此处与源文档不一样-->
<!--            // appRequestFile('/upload/simple?moudle=cms', formData, 'post').then((res) => {-->
<!--            //   console.log('-&#45;&#45;&#45;&#45;images_upload_handler')-->
<!--            //   console.log(res.data.data.filePath)-->
<!--            //   success(res.data.data.filePath)-->
<!--            // })-->
<!--          },-->
<!--          paste_preprocess: function (plugin, args) {-->
<!--            //粘贴图片成功，返回的args.-->
<!--            console.log('-&#45;&#45;paster' + args)-->
<!--          }-->
<!--        },-->
<!--        myValue: this.value-->
<!--      }-->
<!--    },-->
<!--    mounted() {-->
<!--      tinymce.init({})-->
<!--    },-->
<!--    methods: {-->
<!--      //添加相关的事件，可用的事件参照文档=> https://github.com/tinymce/tinymce-vue => All available events-->
<!--      //需要什么事件可以自己增加-->
<!--      onClick(e) {-->
<!--        this.$emit('onClick', e, tinymce)-->
<!--      },-->
<!--      //可以添加一些自己的自定义事件，如清空内容-->
<!--      clear() {-->
<!--        this.myValue = ''-->
<!--      }-->
<!--    },-->
<!--    watch: {-->
<!--      value(newValue) {-->
<!--        this.myValue = newValue-->
<!--      },-->
<!--      myValue(newValue) {-->
<!--        this.$emit('input', newValue)-->
<!--      }-->
<!--    }-->
<!--  }-->

<!--</script>-->
<!--<style scoped>-->
<!--</style>-->


